<!-- 能源信息管理 -->
<template>
  <div class='energyInformation card'>
    <div class='left add_left ' style="min-width:440px">
      <div class='title' style="min-width:400px">
        <span>
          新增：
          <span v-if='type_01 ==="01"'>
            {{type_01|type_01_filter}}
            <i class='el-icon-minus'></i>
            {{type_02|type_02_filter}}
            <span v-show="type_02==='1'">
              <i class='el-icon-minus'></i>
              {{type_03|type_03_filter}}
            </span>
            <span v-show="type_04 === 'CITYE'">
              <i class='el-icon-minus'></i>
              {{type_04|type_04_filter}}
            </span>
            <span v-show="type_03 === 'QJDN'&&type_02==='1'">
              <i class='el-icon-minus'></i>
              {{type_05|type_05_filter}}
            </span>
          </span>
          <span v-if='type_01 ==="02"'>
            {{type_01|type_01_filter}}
            <i class='el-icon-minus'></i>
            {{type_02|type_02_filter}}
            <i class='el-icon-minus'></i>
            {{type_zq_03|type_zq_03_filter}}
          </span>
        </span>
        <el-button type="primary" @click="close_view" icon="el-icon-close" circle></el-button>
      </div>
      <div>能源类型</div>
      <div>
        <el-radio-group v-model="type_01">
          <el-radio-button :label="item.label" :disabled="item.disabled" size='mini' v-for="(item,index) in type_01_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>
      <div v-show="type_01==='01'">计费类别</div>

      <div v-show="type_01==='01'">
        <el-radio-group v-model="type_02">
          <el-radio-button :label="item.label" :disabled="item.disabled" size='mini' v-for="(item,index) in type_02_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>

      <div v-show='type_01 === "01"&&type_02==="1"'>供电类别</div>

      <div v-show='type_01 === "01"&&type_02==="1"'>
        <el-radio-group v-model="type_03">
          <el-radio-button :label="item.label" size='mini' v-for="(item,index) in type_03_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>

      <div v-show='type_01 === "01"&&type_02==="1"'>供电小类</div>

      <div v-show='type_03 === "CTDN"&&type_01 === "01"&&type_02==="1"'>
        <el-radio-group v-model="type_04">
          <el-radio-button :label="item.label" size='mini' v-for="(item,index) in type_04_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>

      <div v-show='type_03 === "QJDN"&&type_01 === "01"&&type_02==="1"'>
        <el-radio-group v-model="type_05">
          <el-radio-button :label="item.label" size='mini' v-for="(item,index) in type_05_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>

      <div v-show="type_01==='02'">计费类别</div>

      <div v-show="type_01==='02'">
        <el-radio-group v-model="type_zq_02">
          <el-radio-button :label="item.label" :disabled="item.disabled" size='mini' v-for="(item,index) in type_zq_02_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>

      <div v-show='type_01 === "02"'>计费方式</div>

      <div v-show='type_01 === "02"'>
        <el-radio-group v-model="type_zq_03">
          <el-radio-button :label="item.label" size='mini' v-for="(item,index) in type_zq_03_data" :key='index'>{{item.name}}</el-radio-button>
        </el-radio-group>
      </div>

    </div>
    <div class='right'>

      <div class='form'>
        <div class='D_01_null' v-show="false">

        </div>
        <el-form :model="ruleForm" :status-icon='true' :rules="rules" ref="ruleForm" :inline='true' label-width="120px" label-position="right">
          <el-form-item label="开始执行日期" prop="zhixing_time">
            <el-date-picker v-model="ruleForm.zhixing_time" type='date' format="yyyy-MM-dd" value-format='yyyy-MM-dd' :picker-options="pickerOptions_zhixing" placeholder="选择日期时间">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="核算对象" prop="hesuan_value" v-if="type_02 ==='2'">
            <el-select v-model="ruleForm.hesuan_value" placeholder="请选择核算对象">
              <el-option v-for="item in ruleForm.hesuan_data" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="销售对象" prop="xiaoshou_value" v-if="type_02==='3'">
            <el-select v-model="ruleForm.xiaoshou_value" placeholder="请选择销售对象">
              <el-option v-for="item in ruleForm.xiaoshou_data" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <div v-if="type_01 ==='01'">
            <el-form-item label="基本电费" style="width:100%" v-if="type_04 === 'CITYE'">
              <el-radio-group v-model="ruleForm.jifei_fangshi">
                <el-radio label="RLJF">基本容量计费</el-radio>
                <el-radio label="XLJF">基本需量计费</el-radio>
              </el-radio-group>
            </el-form-item>

            <el-form-item label="基本容量" prop="jiben_rongliang" v-if="type_04 === 'CITYE'">
              <el-input v-model="ruleForm.jiben_rongliang" style="width:200px">
                <template slot="append">kVA</template>
              </el-input>
            </el-form-item>
            <el-form-item label="基本容量单价" prop="jiben_rongliang_danjia" v-if="type_04 === 'CITYE'">
              <el-input v-model="ruleForm.jiben_rongliang_danjia" style="width:200px">
                <template slot="append">元/kVA/月</template>
              </el-input>
            </el-form-item>

            <el-form-item label="申报需量" prop="shenbao_xuliang" v-if="type_04 === 'CITYE'">
              <el-input v-model="ruleForm.shenbao_xuliang" style="width:200px">
                <template slot="append">k W </template>
              </el-input>
            </el-form-item>
            <el-form-item label="基本需量单价" prop="jiben_xuliang_danjia" v-if="type_04 === 'CITYE'">
              <el-input v-model="ruleForm.jiben_xuliang_danjia" style="width:200px">
                <template slot="append">元 /kW/月 </template>
              </el-input>
            </el-form-item>
            <el-form-item label="电度电费" v-if="type_04 === 'CITYE'">
              <el-radio-group v-model="ruleForm.diandu_dianfei">
                <el-radio label="1">目录电价</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="电度电费" v-else>
              <el-radio-group v-model="ruleForm.diandu_dianfei">
                <el-radio label="1">自定义</el-radio>
                <el-radio label="2">引用目录电价</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="电费折扣" v-if="ruleForm.diandu_dianfei==='2'&&type_04 !== 'CITYE'">
              <el-input v-model="ruleForm.dianfei_zhekou">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
            <div class='jfpg' style="display:block">
              <div v-for="(item,index) in ruleForm.jfpg_data" :key='index' :class='item.name'>
                <el-form-item :prop="'jfpg_data.'+index+'.price'" :label="item.name|jfpg" style="width:100%" :rules="rules.price">
                  <el-input placeholder="请输入电费" v-model="item.price" style='width:200px'>
                    <template slot="append">元</template>
                  </el-input>
                </el-form-item>
                <div v-for="(item_c,index_c) in item.time" :key='index_c'>
                  <el-form-item label="开始时间">
                    <el-time-select v-model="item_c.start" style="width:200px" format='HH:MM' :picker-options="{
                            start: '00:00',
                            step: '01:00',
                            end: '24:00',
                            maxTime: item_c.end
                            }" placeholder="选择开始时间">
                    </el-time-select>
                  </el-form-item>
                  <el-form-item label="结束时间">
                    <el-time-select v-model="item_c.end" style='width:200px' format='HH:MM' :picker-options="{
                              start: item.start?item.start:'00:00',
                              step: '01:00',
                              end: '24:00',
                              minTime: item_c.start
                              }" placeholder="选择开始时间">
                    </el-time-select>
                    <span class='add_delete'>
                      <i class='el-icon-circle-plus-outline' @click='jfpg_add(index,index_c)' v-show="index_c === item.time.length-1"></i>
                      <i class='el-icon-remove-outline' @click='jfpg_delete(index,index_c)' v-show="item.time.length>1"></i>
                    </span>
                  </el-form-item>
                </div>
              </div>
            </div>
            <el-form-item label="特殊电价" style="width:100%" v-if='type_03!=="QJDN"'>
              <el-radio-group v-model="ruleForm.teshu_dianjia">
                <el-radio label="1">不执行</el-radio>
                <el-radio label="2">执行</el-radio>
              </el-radio-group>
            </el-form-item>
            <div v-if='type_03!=="QJDN"&&ruleForm.teshu_dianjia==="2"'>
              <el-form-item prop="teshu_dianjia_start" label="开始月份">
                <el-select v-model="ruleForm.teshu_dianjia_start" style='width:200px' placeholder="请选择开始月份">
                  <el-option v-for="item in ruleForm.teshu_dianjia_s_data" :key="item.id" :label="item.name" :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item prop="teshu_dianjia_end" label="结束月份">
                <el-select v-model="ruleForm.teshu_dianjia_end" style='width:200px' placeholder="请选择结束月份">
                  <el-option v-for="item in ruleForm.teshu_dianjia_e_data" :key="item.id" :label="item.name" :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
              <div class='jfpg' style="display:block">
                <div v-for="(item,index) in ruleForm.jfpg_data_teshu" :key='index' :class='item.name'>
                  <el-form-item :label="item.name|jfpg" style="width:100%">
                    <el-input placeholder="请输入电费" style='width:200px'>
                      <template slot="append">元</template>
                    </el-input>
                  </el-form-item>
                  <div v-for="(item_c,index_c) in item.time" :key='index_c'>
                    <el-form-item label="开始时间">
                      <el-time-select v-model="item_c.start" style="width:200px" format='HH:MM' :picker-options="{
                                  start: '00:00',
                                  step: '01:00',
                                  end: '24:00',
                                  maxTime: item.end
                                  }" placeholder="选择开始时间">
                      </el-time-select>
                    </el-form-item>
                    <el-form-item label="结束时间">
                      <el-time-select v-model="item_c.end" style='width:200px' format='HH:MM' :picker-options="{
                                    start: item.start?item.start:'00:00',
                                    step: '01:00',
                                    end: '24:00',
                                    minTime: item.start
                                    }" placeholder="选择开始时间">
                      </el-time-select>
                      <span class='add_delete'>
                        <i class='el-icon-circle-plus-outline' @click='jfpg_add(index,index_c)' v-show="index_c === item.time.length-1"></i>
                        <i class='el-icon-remove-outline' @click='jfpg_delete(index,index_c)' v-show="item.time.length>1"></i>
                      </span>
                    </el-form-item>
                  </div>
                </div>
              </div>
            </div>

          </div>
          <div v-if="type_01 ==='02'">
            1
          </div>
          <el-form-item label=" " style="width:100%">
            <el-button @click="resetForm('ruleForm')">取消</el-button>
            <el-button type="primary" @click="submitForm('ruleForm')">新增</el-button>
          </el-form-item>
        </el-form>

      </div>
    </div>
  </div>
</template>

<script>
import './index.scss'
export default {
  name: 'energyInformation',
  data() {
    return {
      value1: '2018-11-11',
      type_01: '',
      type_02: '',
      type_03: '',
      type_04: '',
      type_05: '',
      type_zq_02: '',
      type_zq_03: "",
      type_01_data: [
        {
          name: '电',
          label: '01',
          disabled: false,

        },
        {
          name: '蒸汽',
          label: '02',
          disabled: false,
        }
      ],
      type_02_data: [
        {
          name: '采购单价',
          label: '1',
          disabled: false,
        },
        {
          name: '核算单价',
          label: '2',
          disabled: false,
        },
        {
          name: '销售单价',
          label: '3',
          disabled: false,
        }
      ],
      type_03_data: [
        {
          name: '传统电能',
          label: 'CTDN'
        },
        {
          name: '清洁电能',
          label: 'QJDN'
        }
      ],
      type_04_data: [
        {
          name: '市电',
          label: 'CITYE'
        }
      ],
      type_05_data: [
        {
          name: '分布式光伏',
          label: 'GF'
        },
        {
          name: '分布式天然气',
          label: 'TRQ'
        },
        {
          name: '储能',
          label: 'CN'
        }
      ],
      type_zq_02_data: [
        {
          name: '采购单价',
          label: '1',
          disabled: false,
        },
        {
          name: '核算单价',
          label: '2',
          disabled: false,
        },
        {
          name: '销售单价',
          label: '3',
          disabled: false,
        }
      ],
      type_zq_03_data: [
        {
          name: '单一计费',
          label: '1'
        },
        {
          name: '分段累计阶梯计费',
          label: '2'
        },
        {
          name: '按月总量阶梯计费',
          label: '3'
        }
      ],
      ruleForm: {
        zhixing_time: '',
        jiben_rongliang: 0,
        jiben_rongliang_danjia: 0,
        shenbao_xuliang: 0,
        jiben_xuliang_danjia: 0,
        jifei_fangshi: 'RLJF',
        diandu_dianfei: '1',
        dianfei_zhekou: 100,
        teshu_dianjia: '1',
        jfpg_data: [
          {
            name: 'tip',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          },
          {
            name: 'peak',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          },
          {
            name: 'flat',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          },
          {
            name: 'valley',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          }
        ],
        jfpg_data_teshu: [
          {
            name: 'tip',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          },
          {
            name: 'peak',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          },
          {
            name: 'flat',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          },
          {
            name: 'valley',
            price: 0,
            time: [
              {
                start: '',
                end: ''
              }
            ]
          }
        ]
      },
      // pickerOptions: {
      //   disabledDate(time) {
      //     return time.getTime() > Date.now() - 86400000
      //   }
      // },
      pickerOptions_zhixing: {
        disabledDate(time) {
          return time.getTime() < Date.now()
        }
      },
      rules: {
        xiaoshou_value: [
          { required: true, message: '请选择销售对象', trigger: 'change' }
        ],
        hesuan_value: [
          { required: true, message: '请选择核算对象', trigger: 'change' }
        ],
        // gongdianleibie_value: [
        //   { required: true, message: '请选择供电类别', trigger: 'change' }
        // ],
        // gongdian_xiaolei_value: [
        //   { required: true, message: '请选择供电小类', trigger: 'change' }
        // ],
        zhixing_time: [
          { required: true, message: '请选择执行日期', trigger: 'change' }
        ],
        jifei_fangshi: [
          { required: true, message: '请选择计费方式', trigger: 'change' }
        ],
        jiben_rongliang: [
          { required: true, message: '请输入基本容量', trigger: 'change' },
          // { validator: number_02, trigger: 'change' }
        ],
        jiben_rongliang_danjia: [
          { required: true, message: '请输入基本容量单价', trigger: 'change' },
          // { validator: number_02, trigger: 'change' }
        ],
        shenbao_xuliang: [
          { required: true, message: '请输入申报需量', trigger: 'change' },
          // { validator: number_02, trigger: 'change' }
        ],
        jiben_xuliang_danjia: [
          { required: true, message: '请输入基本需量单价', trigger: 'change' },
          // { validator: number_02, trigger: 'change' }
        ],
        // teshu_dianjia: [
        //   { required: true, message: '请选择特殊电价', trigger: 'change' }
        // ],
        // teshu_dianjia_start: [
        //   { required: true, message: '请选择开始月份', trigger: 'change' },
        //   { validator: s_end, trigger: 'change' }

        // ],
        // teshu_dianjia_end: [
        //   { required: true, message: '请选择结束月份', trigger: 'change' },
        //   { validator: s_end, trigger: 'change' }
        // ],
        // zhengqi_jifei_fangshi: [
        //   { required: true, message: '请选择计费方式', trigger: 'change' }
        // ],
        price: [
          { required: true, message: '请输入电费', trigger: 'change' },
          // { validator: number_02, trigger: 'change' }
        ],
        // jian_feng_ping_gu: {
        //   start: [
        //     { required: true, message: '请选择开始时间', trigger: 'change' },
        //   ],
        //   end: [
        //     { required: true, message: '请选择结束时间', trigger: 'change' },
        //   ]

        // }
      },
    }
  },
  created() {
    this.type_01 = '01'
    this.type_02 = '1'
    this.type_03 = 'CTDN'
    this.type_04 = 'CITYE'
    this.type_05 = 'GF'
    this.type_zq_02 = '1'
    this.type_zq_03 = "1"
    // 采购单价未执行是否存在
    // this.checkExist()
  },
  methods: {
    // 采购单价未执行是否存在
    checkExist() {
      setTimeout(() => {
        this.type_02_data[0].disabled = true
        this.type_02 = ''
        // this.type_02 = this.type_02_data[0].label
      }, 1000)
      var fd = new FormData()
      fd.append('custId', sessionStorage.getItem("custId"))
      fd.append('powerClass', this.ruleForm.gongdian_xiaolei_value)
      this.$axios
        .post(this.Eelec + "/energy/info/manage/checkExist", fd)
        .then(res => {
          if (res.data.code === 200) {
            if (res.data.data) {
            } else {
              this.$message({
                type: 'error',
                message: '采购单价已执行,不能执行此操作'
              })
            }
          } else {
            this.$message({
              type: 'error',
              message: '验证采购单价未执行是否存在失败，请重新点击新增操作'
            })
          }
        }).catch((err) => {
          this.$message({
            type: 'error',
            message: '验证采购单价未执行是否存在失败，请重新点击新增操作'
          })
        })
    },
    // 电-核算对象列表
    getAccountList() {
      setTimeout(() => {
        this.type_02_data[1].disabled = true
        // this.type_02 = this.type_02_data[0].label
      }, 1000)
      this.$axios
        .get(this.Eelec + "/electricityPrice/getAccountList",
          {
            params: {
              id: sessionStorage.getItem("custId"),
            }
          }
        )
        .then(res => {
          if (res.data.code === 200) {
            if (res.data.data.length) {
              this.add_dialog = true
              this.ruleForm.hesuan_data = res.data.data
            } else {
              this.ruleForm.hesuan_data = []
              this.$message({
                type: 'error',
                message: '没有可选新核算对象，不能执行此操作'
              })
            }
          } else {
            this.$message({
              type: 'error',
              message: '获取核算对象失败，请重新点击新增操作'
            })
            this.ruleForm.hesuan_data = []
          }
        }).catch((err) => {
          this.$message({
            type: 'error',
            message: '获取核算对象失败，请重新点击新增操作'
          })
          this.ruleForm.hesuan_data = []
        })
    },
    jfpg_delete(index, index_c) {
      this.ruleForm.jfpg_data_teshu[index].time.splice(index_c, 1)

    },
    jfpg_add(index, index_c) {
      this.ruleForm.jfpg_data_teshu[index].time.push(
        {
          start: '',
          end: ''
        }
      )
    },
    resetForm(formName) {
      this.$refs[formName].resetFields()
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          // this.submitForm_btn_loading = true
          // if (this.ruleForm.type === '电') {
          //   if (this.tanchu_leixing_radio === 'a') {
          //     // 采购单价保存
          //     this.energy_info_manage_add()
          //   }
          //   if (this.tanchu_leixing_radio === 'b') {
          //     // 核算单价保存
          //     this.electricityPrice_save()
          //   }
          //   if (this.tanchu_leixing_radio === 'c') {
          //     // 销售单价保存
          //     this.electricityPriceSale_save()
          //   }
          // } else {
          //   if (this.tanchu_leixing_radio === 'a' || this.tanchu_leixing_radio === '1') {
          //     if (this.editor_btn) {
          //       // 蒸汽 采购单价 编辑
          //       this.steamEdit()
          //     } else {
          //       // 蒸汽 采购单价 保存
          //       this.steamAdd()
          //     }
          //   }
          //   if (this.tanchu_leixing_radio === 'b' || this.tanchu_leixing_radio === '2') {
          //     if (this.editor_btn) {
          //       // 蒸汽 核算单价 编辑
          //       this.electricityPrice_steam_save()
          //     } else {
          //       // 蒸汽 核算单价 保存
          //       this.electricityPrice_save_steam()
          //     }
          //   }
          //   if (this.tanchu_leixing_radio === 'c' || this.tanchu_leixing_radio === '3') {
          //     if (this.editor_btn) {
          //       // 蒸汽 销售单价 编辑
          //       this.steamPriceSale_update()
          //     } else {
          //       // 蒸汽 销售单价 保存
          //       this.steamPriceSale_add()

          //     }
          //   }

          // }
        } else {
          this.$message({
            type: 'error',
            message: '请完善能源信息'
          })
          return false
        }
      })
    },
    close_view() {
      this.$router.push('/systemManagement/energyInformation/list/D1')
    }
  },
  mounted() { },
  components: {},
  watch: {
    type_01: function (n, o) {
      // this.ruleForm.jifei_fangshi = 'RLJF'
      // this.ruleForm.teshu_dianjia = '1'
      // this.ruleForm.diandu_dianfei = '1'
      // this.ruleForm.dianfei_zhekou =100
    },
    type_02: function (n, o) {
      // this.ruleForm.jifei_fangshi = 'RLJF'
      // this.ruleForm.teshu_dianjia = '1'
      // this.ruleForm.diandu_dianfei = '1'
      // this.ruleForm.dianfei_zhekou =100
      if (n === '2') {
        // 核算对象列表
        // this.getAccountList()
      }
      if (n === '1') {
        this.type_04 = 'CITYE'
        this.ruleForm.diandu_dianfei = '1'
      } else {
        this.type_03 = 'CTDN'
        this.type_04 = ''
      }
    },
    type_03: function (n, o) {
      // this.ruleForm.jifei_fangshi = 'RLJF'
      // this.ruleForm.teshu_dianjia = '1'
      // this.ruleForm.diandu_dianfei = '1'
      // this.ruleForm.dianfei_zhekou =100
      if (n === 'QJDN') {
        this.type_04 = ''
        this.type_05 = 'GF'
      } else {
        this.type_04 = 'CITYE'
        this.ruleForm.diandu_dianfei = '1'

      }
    },
    type_04: function (n, o) {
      // this.ruleForm.jifei_fangshi = 'RLJF'
      // this.ruleForm.teshu_dianjia = '1'
      // this.ruleForm.diandu_dianfei = '1'
      // this.ruleForm.dianfei_zhekou =100
    },
  },
  filters: {
    jfpg: function (a, arg1, arg2) {
      if (a == 'tip' || a == '01') {
        return '尖'
      }
      if (a == 'peak' || a == '02') {
        return '峰'
      }
      if (a == 'flat' || a == '03') {
        return '平'
      }
      if (a == 'valley' || a == '04') {
        return '谷'
      }
    },
    type_01_filter: function (n) {
      if (n === '01') {
        return '电'
      } else if (n === '02') {
        return '蒸汽'
      } else {
        return n
      }
    },
    type_02_filter: function (n) {
      if (n === '1') {
        return '采购单价'
      } else if (n === '2') {
        return '核算单价'
      } else if (n === '3') {
        return '销售单价'
      } else {
        return n
      }
    },
    type_03_filter: function (n) {
      if (n === 'CTDN') {
        return '传统电能'
      } else if (n === 'QJDN') {
        return '清洁电能'
      } else {
        return name
      }
    },
    type_04_filter: function (n) {
      if (n === 'CITYE') {
        return '市电'
      } else {
        return name
      }
    },
    type_05_filter: function (n) {
      if (n === 'GF') {
        return '分布式光伏'
      } else if (n === 'TRQ') {
        return '分布式天然气'
      } else if (n === 'CN') {
        return '储能'
      } else {
        return n
      }
    },
    type_zq_03_filter: function (n) {
      if (n === '1') {
        return '单一计费'
      } else if (n === '2') {
        return '分段累计阶梯计费'
      } else if (n === '3') {
        return '按月总量阶梯计费'
      } else {
        return n
      }
    },

    no_data: function (a, arg1, arg2) {
      if (a === null) {
        return '--'
      } else {
        return a
      }
    }
  },
}

</script>

<style lang='scss' scoped>
// .my-scroll-bar {
//   height: 200px
// }
// .gm-scrollbar.-vertical {
//   background-color:red
// }

// /* horizontal scrollbar track */
// .gm-scrollbar.-horizontal {
//   background-color: transparent
// }

// /* scrollbar thumb */
// .gm-scrollbar .thumb {
//   background-color: rebeccapurple
// }
// .gm-scrollbar .thumb:hover {
//   background-color: fuchsia
// }
</style>